<template>
  <div>
    <h3>账号信息</h3>
    <div>0xDA0032c6326b9FD7E2BcCF1197A51da6281BECE3</div>
    <div>fd29a7026ba729f6e3481bac75fe61329f7f2b13f50008be37f9ad58376a570a</div>
    <t-divider />
    <div>0x6F2Dd386A968d18a805A86FBC9043DdDfBCBeeC8</div>
    <t-divider />
    <h3>转账操作</h3>
    <t-input v-model:value="formInputValue" placeholder="发送者地址" />
    <t-input v-model:value="toInputValue" placeholder="接收者地址" />
    <t-input v-model:value="mountInputValue" placeholder="金额" suffix="ether" type="number" />
    <t-input v-model:value="pkInputValue" placeholder="密钥" />
    <t-button @click="send(formInputValue, toInputValue, mountInputValue, pkInputValue)" size="large"
      theme="primary">发送交易</t-button>
    <t-divider />
    <div>
      <h3>查看余额</h3>
      <t-input v-model:value="balanceInputValue" placeholder="地址" />
      <t-button @click="getBalance(balanceInputValue)" size="large" theme="primary">查看余额</t-button>
    </div>
  </div>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import Web3 from 'web3';

/**
 * 0xDA0032c6326b9FD7E2BcCF1197A51da6281BECE3
 * fd29a7026ba729f6e3481bac75fe61329f7f2b13f50008be37f9ad58376a570a
 */
/**
 * 0x6F2Dd386A968d18a805A86FBC9043DdDfBCBeeC8
 */

/**实例化web3
* 节点地址 https://www.infura.io/zh
*/
let web3 = new Web3(Web3.givenProvider || "wss://sepolia.infura.io/ws/v3/eec6b159a58d42fc8e411973bea3c756")

const balanceInputValue = ref('')
const formInputValue = ref('')
const toInputValue = ref('')
const mountInputValue = ref('')
const pkInputValue = ref('')

const creteAccout = async () => {


  /**创建账户 */
  const account = web3.eth.accounts.create()
  console.log(account)
  /**账户地址 */
  console.log(account.address)
  /**账户私钥 */
  console.log(account.privateKey)
  /**获取余额 */
  const mount = await web3.eth.getBalance(account.address)
  console.log(mount)
}

const getBalance = async (address: string) => {
  const mount = await web3.eth.getBalance(address)
  console.log(mount)
}

const send = async (from: string, to: string, mount: string, pk: string) => {


  const nonce = await web3.eth.getTransactionCount(from)
  console.log(nonce)
  const gasPrice = await web3.eth.getGasPrice()
  console.log(gasPrice)
  const value = web3.utils.toWei(mount, 'ether');
  console.log(value)
  const rawTx: any = {
    from: from,
    to: to,
    nonce,
    gasPrice,
    value,
    // data: '0x000'
  }
  const gas = await web3.eth.estimateGas(rawTx)
  console.log(gas)
  rawTx.gas = gas
  const sign = await web3.eth.accounts.signTransaction(rawTx, pk)
  console.log(sign)
  sign.rawTransaction
  const trans = web3.eth.sendSignedTransaction(sign.rawTransaction)
  trans.on("transactionHash", (txid) => {
    console.log('交易ID:', txid)
  })
  trans.on("receipt", (res) => {
    console.log("第一个节点确认", res)
  })
  trans.on("confirmation", (res) => {
    console.log("第n个节点确认", res)
  })
}

onMounted(async () => {

  const num1 = Web3.utils.toWei(0.3, "ether")
  console.log(num1)
  console.log(22)
  let num2 = Web3.utils.fromWei(3000000, "ether")
  console.log(num2)



})
</script>
<style scoped>
.aaa {
  color: var(--td-brand-color-6);
}
</style>